//引入nodejs内置的路径模块
const path = require("path");
//引入html插件
const HWP = require("html-webpack-plugin");
//引入css插件
const MCEP = require("mini-css-extract-plugin");
//引入压缩css插件
const CMP = require("css-minimizer-webpack-plugin");
//引入js插件
const PUP = require("webpack-parallel-uglify-plugin");

module.exports = {

    //入口
    entry:"./js/cart.js",

    //出口
    output:{
    //打包前清除上一次的dist文件夹,就是每一次打包都会覆盖之前的打包
    clean:true,
    //打包之后的文件名
    filename:"js/cart.[contenthash:8].js",
    //打包后文件输出路径
    path:path.resolve(__dirname,"./dist"),

    },

    //模式---生产模式
    mode:"production",

    //压缩代码操作，属于优化配置
    optimization:{
        minimizer:[new CMP()],
    },
    
    //去掉注释
    devtool:false,


    //插件配置
    plugins:[
        //实例化
        new HWP({
            template:"./src/cart.html",
            //打包后的文件名
            filename:"index.html",
            //设置所有资源文件注入模板的位置，js默认为head
            inject:"body",
        }),

         //实例化css插件
         new MCEP(
           {
            //打包后的文件名
            filename:"styles/cart.[contenthash:8].css",
           },
         ),

         //实例化 并进行压缩输出js插件
         new PUP({
            uglifyJS:{
                output:{
                    beautify:false,
                    comments:false,

                },

                compress:{
                    drop_console:true,
                    collapse_vars:true,
                    reduce_vars:false,
                },
            },
         }),
    ],

   

    //配置资源文件
    module:{
        rules:[
             //加载css-loader
            {
                test:/\.css$/i,
                use:[MCEP.loader,"css-loader"],
            },
        ],
    },
    
};